<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <link rel="stylesheet" href="css/app.css">
    <link rel="stylesheet" type="text/css" href="css/root.css?var=10"/>
    <link rel="stylesheet" type="text/css" href="css/account/user.css?var=10"/>
    <link rel="stylesheet" type="text/css" href="css/order/order.css?var=10"/>
    <script type="text/javascript" src="js/base/jquery-3.1.1.min.js?ver=2.0.4" charset="utf-8"></script>
    <script type="text/javascript" src="js/base/underscore-min.js"></script>
    <script type="text/javascript" src="js/base/moment.min.js"></script>
    <script src="js/base/api.js?var=10"></script>
    <script src="js/base/magiclamp.js"></script>
    <script src="js/base/base.js"></script>
    <script src="js/base/vue-filter.js"></script>
    <script src="js/base/vue.js"></script>
    <script src="js/pro_orders.js?a=7"></script>
    <script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>


    <!-- Core CSS file -->
    <link rel="stylesheet" href="photoswipe/photoswipe.css">

    <!-- Skin CSS file (styling of UI - buttons, caption, etc.)
         In the folder of skin CSS file there are also:
         - .png and .svg icons sprite,
         - preloader.gif (for browsers that do not support CSS animations) -->
    <link rel="stylesheet" href="photoswipe/default-skin/default-skin.css">

    <!-- Core JS file -->
    <script src="photoswipe/photoswipe.min.js"></script>

    <!-- UI JS file -->
    <script src="photoswipe/photoswipe-ui-default.min.js"></script>

    <title>我来评一评</title>

</head>
<body class="whitesmoke">
<!--订单-->
    <div id="orderlist">
        <div class="com-tag" id="order-tab">
            <a href="#" :class="show_index==0?'tag-on':''" @click="show_index=0"><span>好评</span></a>
            <a href="#" :class="show_index==1?'tag-on':''" @click="show_index=1"><span>差评</span></a>
            <a href="#" :class="show_index==2?'tag-on':''" @click="show_index=2"><span>未评论</span></a>
            <a href="#" :class="show_index==3?'tag-on':''" @click="show_index=3"><span>评价奖励</span></a>
        </div>
        <div style="height: 3rem;color: #dc731d;background-color: #f6eec6; text-align: center;font-size: 1.4rem;padding-top: 0.5rem;">
            评论后，用户在评论页面点击交易成功有奖励哦
        </div>

        <!--未付款-->
        <div class="unfinished-order" v-if="show_index==0">
            <div class="order-item g-wrap" v-for="(order,index) in good_comment_list">

                <div class="my-order-title line" v-on:click.stop="go_goods_detail(order.goods_id)">
                    <div style="display: flex;flex-direction: row; width: 100%;">
                        <div style="flex-grow: 0;flex-shrink: 1">
                            <img :src="baseConfig.qn_host + order.goods__small_image__fileurl+'?imageView2/1/w/65/h/65'" style="height: 5rem;">
                        </div>

                        <div style="display: flex;flex-direction: column;flex: 1 1 auto; margin-left: 0.5rem;">
                            <div style="min-height: 3rem;font-size: 1.4rem;">
                                {{order.goods__name}}
                            </div>
                            <div>
                                <span class="order-goods-price" style="color: #ff3f38;float: left;" v-text="price_filter(order.goods_order_item__price)"></span>
                                <span class="order-goods-price" style="color: #ff3f38;float: right;font-size: 1rem;" v-text="'奖励金额：'+price_filter(order.goods__pro_price)"></span>
                            </div>

                        </div>

                    </div>


                </div>
                <div class="my-order-title line">
                    <div style="width: 60%;">
                        <span  v-if="!order.hide">评价:</span>
                        <span  v-if="order.hide">没有评价</span>
                        <img v-if="!order.hide" v-for="img in start_list"
                             :src="img.index<=order.value+0.5?'img2/star_big_light.png':'img2/star.png'"
                             style="width: 1.2rem;">

                    </div>
                    <div>
                        <img src="img2/yidong.png" style="width: 3rem;" @click="show_yidong(order, index)" />
                    </div>
                </div>
                <div class="my-order-title line">
                    <div style="width: 90%;">
                        <span  v-if="!order.hide" style="font-size: 1.4rem;">{{order.content}}</span>
                        <span  v-if="order.hide">没有评价</span>

                    </div>
                    <a href="javascript:void(0);" @click="edit_pingjia(order)"
                       style="float: right;margin-right: 0.5rem;font-size: 1.2rem;color:blue;"
                    ><u>编辑</u></a>

                </div>
                <div class="my-order-title" v-if="order.file_type==1">
                    <div style="display: flex;flex-direction: row;flex-wrap: wrap;">

                    <img style="margin: 0.1rem;" :src="baseConfig.qn_host + img.fileurl+'?imageView2/1/w/105/h/105'" width="32%" @click="show_big_pengyou_img(order, img.fileurl)" v-if="order.files_json.length>1" v-for="img in order.files_json">
                    <img style="margin: 0.1rem;" :src="baseConfig.qn_host + img.fileurl+'?imageView2/1/w/350/h/350'" width="65%" @click="show_big_pengyou_img(order, img.fileurl)" v-if="order.files_json.length==1" v-for="img in order.files_json">

                    </div>
                </div>
                <div class="my-order-title pengyou_video" v-if="order.file_type==2&&order.video_obj.id" >
                    <video :src="baseConfig.qn_host + order.video_obj.fileurl"   :id="'video'+order.id"
                           style="width:100%;"
                           x-webkit-airplay="true" preload="auto"
                           x5-video-player-type="h5" webkit-playsinline="true"
                           controls
                           playsinline
                           :poster="get_fengmian(order.video_img__fileurl, order.goods__small_image__fileurl)"
                    >

                    </video>
                </div>
                <div class="my-order-title" style="color: #cccccc;">
                    {{order.create_time}}
                </div>

            </div>
            <div class="more" @click="query_goods_comment_by_pro_list_by_one" v-if="good_page_index!=good_page_count">加载更多……
            </div>
            <div class="com-notice" v-if="good_comment_list.length==0">
                <div class="icon-wrap">
                    <i class="iconfont icon-dingdan"></i>
                </div>
                <p>暂无数据</p>
            </div>
        </div>
        <!--已付款-->
        <div class="finished-order" v-if="show_index==1">
            <div class="order-item g-wrap" v-for="(order,index) in bad_comment_list">
                <div class="my-order-title line" v-on:click.stop="go_goods_detail(order.goods_id)">
                    <div style="display: flex;flex-direction: row; width: 100%;">
                        <div style="flex-grow: 0;flex-shrink: 1">
                            <img :src="baseConfig.qn_host + order.goods__small_image__fileurl+'?imageView2/1/w/65/h/65'" style="height: 5rem;">
                        </div>

                        <div style="display: flex;flex-direction: column;flex: 1 1 auto; margin-left: 0.5rem;">
                            <div style="min-height: 3rem;font-size: 1.4rem;">
                                {{order.goods__name}}
                            </div>
                            <div>
                                <span class="order-goods-price" style="color: #ff3f38;float: left;" v-text="price_filter(order.goods_order_item__price)"></span>
                                <span class="order-goods-price" style="color: #ff3f38;float: right;font-size: 1rem;" v-text="'奖励金额：'+price_filter(order.goods__pro_price)"></span>
                            </div>

                        </div>
                    </div>


                </div>
                <div class="my-order-title line">
                    <div style="width: 60%;">
                        <span  v-if="!order.hide">评价:</span>
                        <span  v-if="order.hide">没有评价</span>
                        <img v-if="!order.hide" v-for="img in start_list"
                             :src="img.index<=order.value+0.5?'img2/star_big_light.png':'img2/star.png'"
                             style="width: 1.2rem;">

                    </div>
                    <div>
                        {{order.create_time}}
                    </div>
                </div>
                <div class="my-order-title line">
                    <div style="width: 90%;">
                        <span  v-if="!order.hide" style="font-size: 1.4rem;">{{order.content}}</span>
                        <span  v-if="order.hide">没有评价</span>

                    </div>
                    <a href="javascript:void(0);" @click="edit_pingjia(order)"
                       style="float: right;margin-right: 0.5rem;font-size: 1.2rem;color:blue;"
                    ><u>编辑</u></a>

                </div>
                <div class="my-order-title line" v-if="order.file_type==1">
                    <div style="display: flex;flex-direction: row;flex-wrap: wrap;">

                        <img style="margin: 0.1rem;" :src="baseConfig.qn_host + img.fileurl+'?imageView2/1/w/115/h/115'" width="32%" @click="show_big_pengyou_img(order, img.fileurl)" v-if="order.files_json.length>1" v-for="img in order.files_json">
                        <img style="margin: 0.1rem;" :src="baseConfig.qn_host + img.fileurl+'?imageView2/1/w/350/h/350'" width="65%" @click="show_big_pengyou_img(order, img.fileurl)" v-if="order.files_json.length==1" v-for="img in order.files_json">

                    </div>
                </div>
                <div class="my-order-title line pengyou_video" v-if="order.file_type==2&&order.video_obj.id" >
                    <video :src="baseConfig.qn_host + order.video_obj.fileurl"   :id="'video'+order.id"
                           style="width:100%;"
                           x-webkit-airplay="true" preload="auto"
                           x5-video-player-type="h5" webkit-playsinline="true"
                           controls
                           playsinline
                           :poster="get_fengmian(order.video_img__fileurl, order.goods__small_image__fileurl)"
                    >

                    </video>
                </div>

            </div>
            <div class="more" @click="query_goods_comment_by_pro_list_by_two" v-show="bad_page_index!=bad_page_count">加载更多……
            </div>
            <div class="com-notice" v-if="bad_comment_list.length==0">
                <div class="icon-wrap">
                    <i class="iconfont icon-dingdan"></i>
                </div>
                <p>暂无订单</p>
            </div>
        </div>
        <!--已付款-->
        <div class="finished-order" v-if="show_index==2">
            <div class="order-item g-wrap" v-for="(order,index) in hide_comment_list">
                <div class="my-order-title line">
                    <div style="display: flex;flex-direction: row; width: 100%;">
                        <div style="flex-grow: 0;flex-shrink: 1">
                            <img :src="baseConfig.qn_host + order.goods__small_image__fileurl+'?imageView2/1/w/65/h/65'" style="height: 5rem;">
                        </div>

                        <div style="display: flex;flex-direction: column;flex: 1 1 auto; margin-left: 0.5rem;">
                            <div style="min-height: 3rem;font-size: 1.4rem;">
                                {{order.goods__name}}
                            </div>
                            <div>
                                <span class="order-goods-price" style="color: #ff3f38;float: left;" v-text="price_filter(order.goods_order_item__price)"></span>
                                <span class="order-goods-price" style="color: #ff3f38;float: right;font-size: 1rem;" v-text="'奖励金额：'+price_filter(order.goods__pro_price)"></span>
                            </div>

                        </div>
                    </div>


                </div>
                <div class="my-order-title line">
                    <div style="width: 60%;">
                        <span  v-if="!order.hide">评价:</span>
                        <span  v-if="order.hide">没有评价</span>
                        <img v-if="!order.hide" v-for="img in start_list"
                             :src="img.index<=order.value+0.5?'img2/star_big_light.png':'img2/star.png'"
                             style="width: 1.2rem;">

                    </div>
                    <div>
                        {{order.create_time}}
                    </div>
                </div>
                <div class="my-order-title line">
                    <div style="width: 90%;">
                        <span  v-if="!order.hide" style="font-size: 1.4rem;">{{order.content}}</span>
                        <span  v-if="order.hide">没有评价</span>

                    </div>
                    <a href="javascript:void(0);" @click="edit_pingjia(order)"
                       style="float: right;margin-right: 0.5rem;font-size: 1.2rem;color:blue;"
                    ><u>编辑</u></a>

                </div>
                <div class="my-order-title line" v-if="order.file_type==1">
                    <div style="display: flex;flex-direction: row;flex-wrap: wrap;">

                        <img style="margin: 0.1rem;" :src="baseConfig.qn_host + img.fileurl+'?imageView2/1/w/115/h/115'" width="32%" @click="show_big_pengyou_img(order, img.fileurl)" v-if="order.files_json.length>1" v-for="img in order.files_json">
                        <img style="margin: 0.1rem;" :src="baseConfig.qn_host + img.fileurl+'?imageView2/1/w/350/h/350'" width="65%" @click="show_big_pengyou_img(order, img.fileurl)" v-if="order.files_json.length==1" v-for="img in order.files_json">

                    </div>
                </div>
                <div class="my-order-title line pengyou_video" v-if="order.file_type==2&&order.video_obj.id" >
                    <video :src="baseConfig.qn_host + order.video_obj.fileurl"   :id="'video'+order.id"
                           style="width:100%;"
                           x-webkit-airplay="true" preload="auto"
                           x5-video-player-type="h5" webkit-playsinline="true"
                           controls
                           playsinline
                           :poster="get_fengmian(order.video_img__fileurl, order.goods__small_image__fileurl)"
                    >

                    </video>
                </div>

            </div>
            <div class="more" @click="query_goods_comment_by_pro_list_by_three" v-show="hide_page_index!=hide_page_count">加载更多……
            </div>
            <div class="com-notice" v-if="hide_comment_list.length==0">
                <div class="icon-wrap">
                    <i class="iconfont icon-dingdan"></i>
                </div>
                <p>暂无订单</p>
            </div>
        </div>
        <!--已完成-->
        <div class="finished-order"  v-if="show_index==3">
            <div class="order-item g-wrap" v-for="(order,index)  in pay_order_list">
                <div class="my-order-title line">
                    <div v-text="index+1" style="color: red;font-weight: bold;"></div>
                    <div v-text="order.goodsstore__name"></div>
                    <div class="red-font">
                        <span  >{{order.create_time}}</span>

                    </div>
                </div>
                <div class="line" v-for="goods in order.goods_order_item_list" @click="go_goods_detail(goods.goods_id)">
                    <div class="g-item">
                        <div class="g-item-wrap">
                            <a href="#" class="g-img">
                                <img :src="baseConfig.qn_host + goods.small_image__fileurl+'?imageView2/1/w/80/h/80'">
                            </a>
                            <div class="g-i-info">

                                <p class="g-i-name order-goods-title" ><img src="img2/public_icon_fanli.png" class="img-icon">{{goods.name}}</p>
                                <p class="order-goods-mark margin-bottom" v-if="goods.gg">
                                    {{goods.gg}}</p>
                                <p class="order-goods-mark" v-if="goods.bz" v-text="'备注:'+goods.bz"></p>
                                <p class="order-goods-mark">商品ID:{{goods.goods_id}}</p>
                                <p class="order-count">
                                    <span class="order-goods-price" v-text="price_filter(goods.price)"></span>
                                    <span class="order-goods-num">数量{{goods.num}}</span>
                                </p>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="my-order-title">
                    <div v-text="first_name(order.user__realname)+'购买,成交金额'+price_filter(order.price+order.express_fee)"></div>
                    <div class="red-font">奖励金额:<span class="price" v-text="price_filter(order.pro_price)"></span>
                    </div>

                </div>
            </div>
            <div class="more" @click="query_goods_order_list" v-show="over_page_index!=over_page_count">加载更多……
            </div>
            <div class="com-notice" v-show="pay_order_list.length==0">
                <div class="icon-wrap">
                    <i class="iconfont icon-dingdan"></i>
                </div>
                <p>暂无订单</p>
            </div>
        </div>


        <div id="all_pengyou_images" v-if="show_pengyou_dongtai_images">
            <div class="pswp" id="all_pengyou_pswp" tabindex="-1" role="dialog" aria-hidden="true">

                <!-- Background of PhotoSwipe.
                     It's a separate element as animating opacity is faster than rgba(). -->
                <div class="pswp__bg"></div>

                <!-- Slides wrapper with overflow:hidden. -->
                <div class="pswp__scroll-wrap">

                    <!-- Container that holds slides.
                        PhotoSwipe keeps only 3 of them in the DOM to save memory.
                        Don't modify these 3 pswp__item elements, data is added later on. -->
                    <div class="pswp__container">
                        <div class="pswp__item"></div>
                        <div class="pswp__item"></div>
                        <div class="pswp__item"></div>
                    </div>

                    <!-- Default (PhotoSwipeUI_Default) interface on top of sliding area. Can be changed. -->
                    <div class="pswp__ui pswp__ui--hidden">

                        <div class="pswp__top-bar">

                            <!--  Controls are self-explanatory. Order can be changed. -->

                            <div class="pswp__counter"></div>

                            <button class="pswp__button pswp__button--close" title="Close (Esc)"></button>



                            <!-- Preloader demo http://codepen.io/dimsemenov/pen/yyBWoR -->
                            <!-- element will get class pswp__preloader--active when preloader is running -->
                            <div class="pswp__preloader">
                                <div class="pswp__preloader__icn">
                                    <div class="pswp__preloader__cut">
                                        <div class="pswp__preloader__donut"></div>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="pswp__share-modal pswp__share-modal--hidden pswp__single-tap">
                            <div class="pswp__share-tooltip"></div>
                        </div>

                        <button class="pswp__button pswp__button--arrow--left" title="Previous (arrow left)">
                        </button>

                        <button class="pswp__button pswp__button--arrow--right" title="Next (arrow right)">
                        </button>

                        <div class="pswp__caption">
                            <div class="pswp__caption__center"></div>
                        </div>

                    </div>

                </div>

            </div>
        </div>

        <div id="yidong_div" style="position:fixed;right:0;z-index:1002;background-color:#000;left:0;overflow-y:scroll;top:0;bottom: 0;opacity:0.4;" v-if="show_yidong_div" @click="hide_yidong()">

        </div>
        <div style="position:fixed;right:5rem;z-index:1003;background-color:#fff;left:5rem;overflow-y:scroll;top:10rem;padding: 1rem;" v-if="show_yidong_div" >
            <div style="width: 100%;border-bottom: 1px solid #767676;display: flex;flex-direction:row;padding: 0.7rem;" @click="up_yidong()">
                <img src="img2/yidong_shang.png" style="width: 2rem;height: 2rem;">
                <div style="margin-left: 1rem;">上移</div>
            </div>
            <div style="width: 100%;border-bottom: 1px solid #767676;display: flex;flex-direction:row;padding: 0.7rem;" @click="down_yidong()">
                <img src="img2/yidong_xia.png" style="width: 2rem;height: 2rem;">
                <div style="margin-left: 1rem;">下移</div>
            </div>
            <div style="width: 100%;display: flex;flex-direction:row;padding: 0.7rem;" @click="ding_yidong()">
                <img src="img2/yidong_zhiding.png" style="width: 2rem;height: 2rem;">
                <div style="margin-left: 1rem;">置顶</div>
            </div>
        </div>
    </div>
</body>
</html>